<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp" %>
<link rel="stylesheet" type="text/css" href="../../css/style.css"/>
<html>
<head>
    <title>车辆调度</title>
    <meta name="decorator" content="default"/>
    <link href="${ctxStatic}/static_back/css/public.css" type="text/css" rel="stylesheet">
    <link href="${ctxStatic}/static_back/css/main.css" type="text/css" rel="stylesheet">
    <script src="https://webapi.amap.com/maps?v=1.4.9&key=f50df840d14861c95415ec7742d42d86"></script>
</head>

<body>
    <%--标题--%>
    <div class="top-section">
        <h2>乘车点管理</h2>
        <div class="top-section-right">
            <button id="mcar" class="btn btn-blue" onclick="moveCar();">移动车辆</button>
        </div>
    </div>

    <div class="body-section dispatch-body">
        <div class="ridepoint-list scroll-box">

            <%--sss应急停车场sss--%>
            <c:forEach items="${emsPointVO}" var="dto">
            <div class="ridepoint-li" id="emsPoint" data-pointId="${dto.ridePoint.id}">
                <%--数据头--%>
                <div class="ridepoint-li-head">
                    <h4>${dto.ridePoint.name}</h4>
                    <ul>
                        <li>
                            <span>${fn:length(dto.cars)}</span>
                            <em>车辆数</em>
                        </li>
                        <li>
                            <span>${dto.seatingSum>0?dto.seatingSum:0}</span>
                            <em>座位数</em>
                        </li>
                    </ul>
                    <div class="layer">
                        <span>车辆列表</span>
                        <input type="text" placeholder="车牌查询" class="car-search" />
                    </div>
                </div>
                <%--车辆列表--%>
                <div class="ridepoint-li-body scroll-box">
                    <ul class="car-list">
                        <c:forEach items="${dto.cars}" var="car">
                            <c:choose>
                                <c:when test="${empty car.status or car.status == ''}">
                                    <li class="error">
                                        <label>
                                            <input type="checkbox" data-id="${car.id}" class="cbox car-checkbox" />
                                        </label>
                                        <p class="car-li-info" title="查看车辆信息" data-id="${car.id}">
                                            <span>${car.carNumber}</span>&nbsp;&nbsp;<span>${car.seating>0?car.seating:0}座</span><br/>
                                            <em>GPS异常！！</em>
                                        </p>
                                    </li>
                                </c:when>
                                <c:when test="${car.isOnline==-1}">
                                    <li class="error">
                                        <label>
                                            <input type="checkbox" data-id="${car.id}" class="cbox car-checkbox" />
                                        </label>
                                        <p class="car-li-info" title="查看车辆信息" data-id="${car.id}">
                                            <span>${car.carNumber}</span>&nbsp;&nbsp;<span>${car.seating>0?car.seating:0}座</span><br/>
                                            <em>偏离路线</em>
                                        </p>
                                    </li>
                                </c:when>
                                <c:otherwise>
                                    <li>
                                        <label>
                                            <input type="checkbox" data-id="${car.id}" class="cbox car-checkbox" />
                                        </label>
                                        <p class="car-li-info" title="查看车辆信息" data-id="${car.id}">
                                            <span>${car.carNumber}</span>&nbsp;&nbsp;<span>${car.seating>0?car.seating:0}座</span><br/>
                                            <em>正常</em>
                                        </p>
                                    </li>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                        <%--todo 异常、偏离车辆添加样式error--%>
                        <%--<li class="error">--%>
                            <%--<label>--%>
                                <%--<input type="checkbox" class="car-checkbox" />--%>
                            <%--</label>--%>
                            <%--<p class="car-li-info" title="查看车辆信息" data-id="${car.id}">--%>
                                <%--<span>粤AB1234</span>&nbsp;&nbsp;<span>50座</span><br/>--%>
                                <%--&lt;%&ndash;todo 异常、偏离车辆对应更改文案&ndash;%&gt;--%>
                                <%--<em>GPS异常</em>--%>
                            <%--</p>--%>
                        <%--</li>--%>
                    </ul>
                </div>
            </div>
            </c:forEach>
            <%--eee应急停车场eee--%>

            <%--sss乘车点块sss--%>
            <c:forEach items="${pointVO}" var="dto">
            <div class="ridepoint-li">
                <%--数据头--%>
                <div class="ridepoint-li-head">
                    <h4 data-id="${dto.ridePoint.id}">${dto.ridePoint.route>0?dto.ridePoint.route:''} ${dto.ridePoint.name}</h4>
                    <ul>
                        <li>
                            <span>${fn:length(dto.cars)}</span>
                            <em>车辆数</em>
                        </li>
                        <li>
                            <span>${dto.seatingSum>0?dto.seatingSum:0}</span>
                            <em>座位数</em>
                        </li>
                    </ul>
                    <div class="layer">
                        <span>车辆列表</span>
                        <input type="text" placeholder="车牌查询" class="car-search" />
                    </div>
                </div>
                <%--车辆列表--%>
                <div class="ridepoint-li-body scroll-box">
                    <ul class="car-list">
                        <c:forEach items="${dto.cars}" var="car">
                            <c:choose>
                                <c:when test="${empty car.status or car.status == ''}">
                                    <li class="error">
                                        <label>
                                            <input type="checkbox" data-id="${car.id}" class="cbox car-checkbox" />
                                        </label>
                                        <p class="car-li-info" title="查看车辆信息" data-id="${car.id}">
                                            <span>${car.carNumber}</span>&nbsp;&nbsp;<span>${car.seating>0?car.seating:0}座</span><br/>
                                            <em>GPS异常！！</em>
                                        </p>
                                    </li>
                                </c:when>
                                <c:when test="${car.isOnline==-1}">
                                    <li class="error">
                                        <label>
                                            <input type="checkbox" data-id="${car.id}" class="cbox car-checkbox" />
                                        </label>
                                        <p class="car-li-info" title="查看车辆信息" data-id="${car.id}">
                                            <span>${car.carNumber}</span>&nbsp;&nbsp;<span>${car.seating>0?car.seating:0}座</span><br/>
                                            <em>偏离路线</em>
                                        </p>
                                    </li>
                                </c:when>
                                <c:otherwise>
                                    <li>
                                        <label>
                                            <input type="checkbox" data-id="${car.id}" class="cbox car-checkbox" />
                                        </label>
                                        <p class="car-li-info" title="查看车辆信息" data-id="${car.id}">
                                            <span>${car.carNumber}</span>&nbsp;&nbsp;<span>${car.seating>0?car.seating:0}座</span><br/>
                                                <em>正常</em>
                                        </p>
                                    </li>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </ul>
                </div>
            </div>
            </c:forEach>
            <%--eee乘车点块eee--%>
        </div>
    </div>

    <%--调度窗口--%>
    <div id="moveDiv" class="window-layer window-dispatch">
        <div class="window-bg"></div>
        <div class="window-main">
            <h3>转移选中车辆</h3>
            <div class="window-body">
                <div class="dispatch-left scroll-box">
                    <ul class="car-list" id="checkedCar">
                    </ul>
                </div>
                <div class="dispatch-m">
                    <span>将车辆转移至</span>
                    <img src="${ctxStatic}/static_back/img/dispatch_icon.png" alt="" />
                </div>
                <div class="dispatch-right scroll-box">
                    <ul>
                        <c:forEach items="${emsPointVO}" var="dto">
                            <li>
                                <label>
                                    <p>${dto.ridePoint.name}</p>
                                    <span>${fn:length(dto.cars)}辆</span>
                                    <input type="checkbox" data-id="${dto.ridePoint.id}" class="point-checkbox" />
                                </label>
                            </li>
                        </c:forEach>
                        <c:forEach items="${pointVO}" var="dto">
                        <li>
                            <label>
                                <p>${dto.ridePoint.name}</p>
                                <span>${fn:length(dto.cars)}辆</span>
                                <input type="checkbox" data-id="${dto.ridePoint.id}" class="point-checkbox" />
                            </label>
                        </li>
                        </c:forEach>
                    </ul>
                </div>
            </div>
            <div class="window-bottom">
                <input type="button" class="btn btn-blue" value="确定转移" onclick="moveCarUpdate()" />
                <input type="button" class="btn" value="取 消" onclick="CloseDiv()" />
            </div>
        </div>
    </div>


    <%--车辆详情弹窗--%>
    <div id="detailCarDiv" class="window-layer window-details window-details-2">
        <div class="window-bg"></div>
        <div class="window-main">
            <div class="window-body">

                <%--主要信息--%>
                <div class="details-div">
                    <h3 class="car_number"></h3>
                    <div class="info-box">
                        <ul class="info-list">
                            <li class="info-icon-car" title="类型">
                                <span id="car_type"></span>
                            </li>
                            <li class="info-icon-building" title="所属单位">
                                <span id="car_belong"></span>
                            </li>
                            <li class="info-icon-position" title="车辆定位">
                                <span id="car_position"></span>
                            </li>
                        </ul>
                        <ul class="info-data">
                            <li>
                                <span id="car_seating"></span>个<br/>座位
                            </li>
                            <li>
                                <span id="car_status"></span><br/>状态
                            </li>
                        </ul>
                    </div>

                    <%--todo 车辆偏离，增加样式：map-box-deviate，并给span传文字--%>
                    <%--todo GPS异常，增加样式：map-box-error，并给span传文字--%>
                    <div class="map-box">
                        <div class="map-box-box" id="mapBox">
                        </div>
                        <div class="error-tip">
                            <span>GPS异常！！</span>
                            <%--<span>车辆偏离路线！！</span>--%>
                        </div>
                    </div>

                    <div class="window-bottom">
                        <input type="button" class="btn" value="关闭" onclick="CloseCarDetailDiv()"/>
                    </div>
                </div>

                <%--附属信息--%>
                <div class="subdetails-div">
                    <div class="info-box">
                        <h4>司机信息</h4>
                        <ul class="info-list">
                            <li class="info-icon-person" title="司机姓名">
                                <span id="car_name"></span>
                            </li>
                            <li class="info-icon-phone" title="司机电话">
                                <span id="car_phone"></span>
                            </li>
                            <li class="info-icon-talk" title="对讲机">
                                <span id="car_interphone"></span>
                            </li>
                        </ul>
                    </div>
                    <div class="info-box">
                        <h4>行程信息</h4>
                        <ul class="info-list">
                            <li class="info-icon-line" title="线路">
                                <span class="car_rp_line"></span>
                            </li>
                            <li class="info-icon-start" title="行程起点">
                                <span class="car_startpointName"></span>
                            </li>
                            <li class="info-icon-end" title="行程终点">
                                <span class="car_tarplace"></span>
                            </li>
                        </ul>
                    </div>
                    <div class="info-box">
                        <h4>服务站点信息</h4>
                        <ul class="info-list">
                            <li class="info-icon-home" title="乘车点">
                                <span id="car_pointName"></span>
                            </li>
                            <li class="info-icon-position" title="乘车点位置">
                                <span id="point_position"></span>
                            </li>
                            <li class="info-icon-person" title="乘车点负责人">
                                <span id="car_leader"></span>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <%--详情弹窗--%>
    <div id="detailPointDiv" class="window-layer window-details window-details-2">
        <div class="window-bg"></div>
        <div class="window-main">
            <div class="window-body">

                <%--主要信息--%>
                <div class="details-div">
                    <h3 id="air_rp_name"></h3>
                    <div class="info-box">
                        <ul class="info-list">
                            <li class="info-icon-position" title="乘车点位置">
                                <span id="air_rp_position"></span>
                            </li>
                            <li class="info-icon-person" title="乘车点负责人">
                                <span id="air_rp_leader"></span>&nbsp&nbsp
                                <span id="air_rp_phone"></span>
                            </li>
                            <li class="info-icon-talk" title="对讲机">
                                <span id="air_rp_interphone"></span>
                            </li>
                            <li class="info-icon-warning" title="候车预警">
                                <span id="air_rp_warn"></span>
                            </li>
                        </ul>
                        <ul class="info-data">
                            <li>
                                <span id="air_rp_busSum"></span>辆<br/>专线巴士
                            </li>
                            <li>
                                <span id="air_rp_seat"></span>个<br/>座位
                            </li>
                            <li>
                                <span id="air_rp_driverSum"></span>名<br/>司机
                            </li>
                            <li>
                                <span id="air_rp_workerSum"></span>名<br/>工作人员
                            </li>
                        </ul>
                    </div>
                    <div class="camera-list">
                        <div class="camera-box">
                            <object id="pointCamera1" type='application/x-vlc-plugin' events='True' width="100%" height="100%">
                                <param name='mrl' value='' />
                                <param name='volume' value='0' />
                                <param name='autoplay' value='true' />
                                <param name='loop' value='false' />
                                <param name='fullscreen' value='true' />
                            </object>
                        </div>
                        <div class="camera-box">
                            <object id="pointCamera2" type='application/x-vlc-plugin' events='True' width="100%" height="100%">
                                <param name='mrl' value='' />
                                <param name='volume' value='0' />
                                <param name='autoplay' value='true' />
                                <param name='loop' value='false' />
                                <param name='fullscreen' value='true' />
                            </object>
                        </div>
                        <div class="camera-box">
                            <object id="pointCamera3" type='application/x-vlc-plugin' events='True' width="100%" height="100%">
                                <param name='mrl' value='' />
                                <param name='volume' value='0' />
                                <param name='autoplay' value='true' />
                                <param name='loop' value='false' />
                                <param name='fullscreen' value='true' />
                            </object>
                        </div>
                        <div class="camera-box">
                            <object id="pointCamera4" type='application/x-vlc-plugin' events='True' width="100%" height="100%">
                                <param name='mrl' value='' />
                                <param name='volume' value='0' />
                                <param name='autoplay' value='true' />
                                <param name='loop' value='false' />
                                <param name='fullscreen' value='true' />
                            </object>
                        </div>
                    </div>
                    <div class="window-bottom">
                        <input type="button" class="btn" value="关闭" onclick="CloseDetailDiv()"/>
                    </div>
                </div>

                <%--附属信息--%>
                <div class="subdetails-div">
                    <div class="info-box">
                        <h4>行程信息</h4>
                        <ul class="info-list">
                            <li class="info-icon-line" title="线路">
                                <span id="air_rp_line"></span>
                            </li>
                            <li class="info-icon-start" title="行程起点">
                                <span class="car_startpointName"></span>
                            </li>
                            <li class="info-icon-end" title="行程终点">
                                <span class="car_tarplace"></span>
                            </li>
                            <li class="info-icon-cost" title="行程费用">
                                <span id="air_rp_typeText"></span>
                            </li>
                        </ul>
                    </div>
                    <div class="info-box">
                        <h4>预约乘车信息</h4>
                        <ul class="info-list">
                            <li class="info-icon-point">
                                11-09 已预约 <span class="point-num" id="appoint_nine"></span> 人
                            </li>
                            <li class="info-icon-point">
                                11-10 已预约 <span class="point-num" id="appoint_ten"></span> 人
                            </li>
                            <li class="info-icon-point">
                                11-11 已预约 <span class="point-num" id="appoint_eleven"></span> 人
                            </li>
                        </ul>
                    </div>
                    <div class="info-box">
                        <h4>乘客运送信息</h4>
                        <ul class="info-list">
                            <li class="info-icon-point">
                                11-09 已运送 <span class="point-num" id="send_nine"></span> 人
                            </li>
                            <li class="info-icon-point">
                                11-10 已运送 <span class="point-num" id="send_ten"></span> 人
                            </li>
                            <li class="info-icon-point">
                                11-11 已运送 <span class="point-num" id="send_eleven"></span> 人
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>



    <script type="text/javascript">

        $(function () {
            //站点内车辆搜索
            $('.car-search').each(function (index,element_input) {
                $(this).bind("input propertychange",function () {
                    var search = $(this).val();
                    $(this).closest(".ridepoint-li").find(".car-list li").each(function (index,element) {
                        var val = $(element).find('span').eq(0).html();
                        if(val.indexOf(search)!==-1){
                            $(this).show();
                        }else {
                            $(this).hide();
                        }
                    })
                })
            });

            //改变选车样式
            $(document).on("change", ".car-checkbox", function () {
                if($(this).attr("checked") != undefined){
                    $(this).closest("li").addClass("check");
                } else {
                    $(this).closest("li").removeClass("check");
                }
            })
            //改变选乘车点样式
            .on("change", ".point-checkbox", function () {
                if($(this).attr("checked") != undefined){
                    $(this).closest("ul").find("li").removeClass("check");
                    $(this).closest("ul").find(".point-checkbox").attr("checked",false);
                    $(this).closest("li").addClass("check");
                    $(this).attr("checked",true);
                } else {
                    $(this).closest("li").removeClass("check");
                }
            })
            //打开车辆弹窗
            .on("click",".car-li-info",function(){
                console.log("打开车辆弹窗");
                var carId = $(this).data("id");
                $.ajax({
                    url: "${ctx}/air/airCar/getCarMessage",
                    type: "GET",
                    data: {carid: carId},
                    success: function (data) {
                        console.log(data);
                        var car = data.data;
                        var driver = data.data.driver;
                        var point = data.data.airRidePoint;
                        $("#car_type").html(car.type);
                        $(".car_number").html(car.carNumber);
                        $("#car_belong").html(car.belongUnit);
                        $("#car_seating").html(car.seating);
                        $("#car_status").html(getStatusNote(car.status));
                        if(typeof driver !== 'undefined') {
                            $("#car_name").html(driver.name);
                            $("#car_interphone").html(driver.interphone);
                            $("#car_phone").html(driver.phone);
                        }
                        if(typeof point !== 'undefined') {
                            //todo 缺少线路
                            var route = point.route>0?(point.route+"号线"):'';
                            $(".car_rp_line").html(route);
                            $(".car_startpointName").html(point.name);
                            $("#car_consuming").html(point.consumed);
                            $("#car_pointName").html(point.name);
                            $("#car_leader").html(point.leader);
                            $("#point_position").html(point.position);
                            var parking = point.airParkingLot;
                            if(typeof parking !== 'undefined') {
                                $(".car_tarplace").html(parking.name);
                            }
                        }
                        catchCarOffset(car);
                        initMap(car);
                    }
                });
            })
            //打开乘车点详情
            .on("click",".ridepoint-li-head>h4",function(){
                var pointId = $(this).data("id");
                if(pointId == undefined) return false
                var seat = getSeat(pointId);
                $.ajax({
                    url: "${ctx}/air/airRidePoint/getById",
                    type: "GET",
                    data: {id: pointId},
                    success: function (result) {
                        var arp = result.data;
                        console.log(arp);
                        $("#air_rp_name").html(arp.name);
                        $("#air_rp_position").html(arp.position);
                        $("#air_rp_leader").html(arp.leader);
                        $("#air_rp_phone").html(arp.phone);
                        $("#air_rp_interphone").html(arp.interphone);
                        var warn = "候车超过 " + arp.sliRetention + " 人为 轻微滞留，超过 " + arp.serRetention + " 人为 严重滞留";
                        $("#air_rp_warn").html(warn);
                        $("#air_rp_busSum").html(arp.busSum);
                        $("#air_rp_seat").html(seat);
                        $("#air_rp_line").html(arp.route + "号线");
                        $("#air_rp_driverSum").html(arp.driverSum);
                        $("#air_rp_workerSum").html(arp.workerSum);
                        $(".car_startpointName").html(arp.name);
                        if (typeof arp.airParkingLot !== "undefined") {
                            $(".car_tarplace").html(arp.airParkingLot.name);
                        }
                        $("#air_rp_typeText").html(arp.typeText);

                        // 启动视频
                        play("pointCamera1",arp.camera1);
                        play("pointCamera2",arp.camera2);
                        play("pointCamera3",arp.camera3);
                        play("pointCamera4",arp.camera4);
                    }
                });
                $.ajax({
                    url: "${ctx}/air/airRidePoint/getCountById",
                    type: "GET",
                    data: {id: pointId},
                    success:function (result) {
                        var date = result.data;
                        $("#appoint_nine").html(date.appoint1+"");
                        $("#appoint_ten").html(date.appoint2+"");
                        $("#appoint_eleven").html(date.appoint3+"");
                        $("#send_nine").html(date.took1+"");
                        $("#send_ten").html(date.took2+"");
                        $("#send_eleven").html(date.took3+"");
                    }
                });
                $("#detailPointDiv").css("display", "block");
//                // 启动视频
//                play("pointCamera1","rtsp://admin:Thinkjoy2015@192.168.0.242:554/h264/ch1/main/av_stream");
//                play("pointCamera2","rtsp://admin:Thinkjoy2015@192.168.0.242:554/h264/ch1/main/av_stream");
//                play("pointCamera3","rtsp://admin:Thinkjoy2015@192.168.0.242:554/h264/ch1/main/av_stream");
//                play("pointCamera4","rtsp://admin:Thinkjoy2015@192.168.0.242:554/h264/ch1/main/av_stream");
            });
        });

        //初始化车辆地图
        var initMap = function (car) {
            if(typeof car.lon !== 'undefined'&&typeof car.lat !=='undefined'){
                var map = new AMap.Map('mapBox', {
                    zoom: 11, //初始化地图层级
                    center: [car.lon, car.lat] //初始化地图中心点
                });
                var maker = new AMap.Marker({
                    position: new AMap.LngLat(car.lon, car.lat),
                    title: car.carNumber
                });
                map.add(maker);
                AMap.plugin('AMap.Geocoder', function() {
                    var geocoder = new AMap.Geocoder({
                        city: '珠海',
                    });
                    var lnglat = [car.lon, car.lat];
                    geocoder.getAddress(lnglat, function(status, result) {
                        if (status === 'complete' && result.info === 'OK') {
                            // result为对应的地理位置详细信息
                            var address = result.regeocode.addressComponent
                            $("#car_position").html(address.city+address.district+address.township+address.street+address.streetNumber);
                        }
                    })
                });
                $("#detailCarDiv").css("display", "block");
            }else {
                var map = new AMap.Map('mapBox', {
                    zoom: 11, //初始化地图层级
                    center: [113.58397428, 22.2790923] //初始化地图中心点
                });
                $("#car_position").html("未知位置！");
                $("#detailCarDiv").css("display", "block");
            }
        };
        // 车辆状态
        var statusNote = ['待发车', '已发车', '已到达', '已返程'];
        var getStatusNote = function (status) {
            if (typeof status === 'undefined'||status == null || status == '') {
                return 'GPS异常';
            }
            return statusNote[status - 1];
        };
        var catchCarOffset = function (car) {
            var status = car.status;
            if (typeof status === 'undefined'||status == null || status == '') {
                $("#mapBox").parent().addClass("map-box-error");
                $(".error-tip span").html("GPS异常！！");
            }else if(typeof car.lon !== 'undefined') {
                $("#mapBox").parent().removeClass("map-box-error");
                if (car.isOnline === -1) {
                    $("#mapBox").parent().addClass("map-box-deviate");
                    $(".error-tip span").html("车辆偏离路线！！");
                }
                else {
                    $("#mapBox").parent().removeClass("map-box-deviate");
                    $(".error-tip span").html("");
                }
            }
        };

        //获取座位数
        function getSeat(id) {
            var seat = 0;
            $.ajax({
                url: "${ctx}/air/airRidePoint/getSeatById",
                type: "GET",
                data: {id: id},
                async:false,
                success: function (result) {
                    console.log(result);
                    seat = result.data;
                }
            });
            return seat;
        }


        /**
         * 打开调度弹框
         */
        function moveCar() {
            var c = false;
            $(".ridepoint-li-body .car-checkbox").each(function (index, val) {
                if ($(val).prop("checked")) {
                    c = true;
                }
            });
            if (!c) {
                alert("必须选中一辆或多辆车");
                window.location.hash = "#test";
            } else {
                var arr = [];
                $(".car-checkbox").each(function (index, val) {
                    var checkon = $(val).prop("checked");
                    if (checkon) {
                        var id = $(val).data("id");
                        arr.push(id);
                    }
                });
                $.ajax({
                    url: "${ctx}/air/carDispatch/getCheckOn",
                    type: "GET",
                    traditional: true,
                    data: {ids: arr},
                    success: function (data) {
                        var cars = data.data;
                        $(cars).each(function (index, val) {
                            var text = "<li data-id=\"" + $(val).prop("id") + "\" >" +
                                    "<p>"+
                                    "<span>" + $(val).prop("carNumber") + "&nbsp;&nbsp;" + $(val).prop("seating") + "座</span><br/>" +
                                    "<em>正常</em>" +
                                    "</p>"+
                                    "<button class='car-cancel' onclick=\"closeBox(this)\" data-id=\"" + $(val).prop("id") + "\">X</button>" +
                                    "</li>";
                            $("#checkedCar").append(text);
                        });
                    }
                });
                $("#moveDiv").css("display", "block");
            }
        }
        function CloseDiv() {
            $("#checkedCar").empty();
            $("#moveDiv").css("display", "none");
        }


        /**
         * 删除左边的车辆框
         */
        function closeBox(t) {
            $(t).closest("li").remove();
        }

        /**
         * 更新转移车辆
         */
        function moveCarUpdate() {
            //    查询所有的车辆id，拼成数组
            var arr = [];
            $(".dispatch-left li").each(function (index, val) {
                arr.push($(val).data("id"));
            });
            //    查询右边选中的乘车点id
            var pointId;
            $(".point-checkbox").each(function (index, val) {
                if ($(val).prop("checked")) {
                    console.log($(val));
                    pointId = $(val).data("id");
                }
            });
            if(arr.length == 0){
                alert("必须选中一辆或多辆车");
                return false
            }
            if(pointId == undefined){
                alert("必须选中一个乘车点");
                return false
            }

            $.ajax({
                url: "${ctx}/air/carDispatch/moveCarUpdate",
                type: "POST",
                traditional: true,
                data: {carIds: arr, pointId: pointId},
                success: function (data) {
                    if (data.code == 200) {
                        $("#moveDiv").css("display", "none");
                        location.reload();
                    }
                }
            });
        }

        function CloseDetailDiv() {
            $(".window-layer").css("display", "none");
            //结束所有监控视频
            stop("pointCamera1");
            stop("pointCamera2");
            stop("pointCamera3");
            stop("pointCamera4");
        }

        function CloseCarDetailDiv() {
            $(".window-layer").css("display", "none");
        }

        //播放视频
        function play(id,href){
            var vlc = document.getElementById(id);
            vlc.playlist.clear();
            vlc.playlist.add(href);
            vlc.playlist.play();
        }

        //停止播放
        function stop(id){
            var vlc = document.getElementById(id);
            vlc.playlist.stop();
        }

//        function carSearch() {
//            window.location.hash = "";
//            var search = $("#car_search").val().trim();
//            console.log("正在搜索" + search);
//            $(".table_search").each(function () {
//                $(this).css("background","none");
//                if(search === null||search === ""){
//                    return;
//                }
//                var value= $(this).find("tr").eq(0).find("td").eq(0).html();
//                if(value.indexOf(search)!==-1){
//                    $(this).css("background","#FFFB3E");
//                    $(this).attr("id","table_search");
//                    window.location.hash = "#table_search";
//                    $(this).removeAttr("id");
//                };
//            })
//        }

    </script>
</body>
</html>